<template>
    <div class="flex colorF" style="width:100%;height:100%;">
        <div class="flex1 flexC AlignItemsC">
            <p class="creditModal-title textC font_s26">采信</p>
            <div class="creditModal-left flexC AlignItemsC">
                <p style="line-height:2.625rem;">行业信用</p>
                <div class="flexC AlignItemsC" style="width:100%;height:100%;padding-top:6.685rem;">
                    <img src="../../../assets/img/comprehensive/left/17.png" width="75%" height="55%" alt="">
                    <p class="font_s36 left-contentbg">100%</p>
                    <div class="flex">
                        <p style="position:absolute;top:38.5%;left:7.5%;">金融 ----</p>
                        <p style="position:absolute;top:43.5%;right:71%;">----税务</p>
                        <p style="position:absolute;top:48.5%;left:7%;">其他单位----</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="flex1 flexC AlignItemsC">
            <p class="creditModal-title textC font_s26">评信</p>
            <div class="flexC creditModal-middle">
                <div class="flex3 flexC JustifyContentSA">
                    <p class="flex">
                        <span class="creditModal-middleLeft middleLeftImg01 textC">低信用</span>
                        <span class="creditModal-middleRight textC font_s22 colorF">六个双平台信用评估C级单位</span>
                    </p>
                    <p class="flex">
                        <span class="creditModal-middleLeft middleLeftImg02 textC">中信用</span>
                        <span class="creditModal-middleRight textC font_s22 colorF">六个双平台信用评估B级单位</span>
                    </p>
                    <p class="flex">
                        <span class="creditModal-middleLeft middleLeftImg03 textC">高信用</span>
                        <span class="creditModal-middleRight textC font_s22 colorF">六个双平台信用评估A级单位</span>
                    </p>
                </div>
                <div class="flex2">
                    <div class="creditModal-middleBottom colorF">
                        <p class="textC font_s24" style="line-height:2.485rem;">信息动态调整</p>
                        <p class="textC" style="margin-top:1rem;">
                            <span style="display: inline-block;padding: 0.425rem 1.825rem;background:#3C92D4;margin-right:1rem;">信用修复</span>
                            <span style="display: inline-block;width:15.225rem;height:5.285rem;text-align:left;">上次信用检查出现问题若整改掉，则信用等级予以提升</span>
                        </p>
                        <p class="flex AlignItemsC JustifyContentC">
                            <span style="display: inline-block;padding: 0.425rem 1.825rem;background:#E66E63;margin-right:1rem;">一票否决</span>
                            <span style="display: inline-block;width:15.225rem;height:5.285rem;text-align:left;">未经批准擅自修改公墓建设规划、 扩大建设用地面积／未依法办理建设用地手续，违法违规使用土地等内容</span>
                        </p>
                    </div>
                </div>
            </div>
        </div>
        <div class="flex1 flexC AlignItemsC">
            <p class="creditModal-title textC font_s26">用信</p>
            <div class="flexC creditModal-right">
                <div class="flex1 flexC JustifyContentC">
                    <ul class="textC colorF font_s18">
                        <li class="flex" style="background:#11395d;line-height:2.225rem;margin-bottom:0.825rem;">
                            <span class="flex1">信用等级</span>
                            <span class="flex1">抽样比例</span>
                            <span class="flex1">监管频次</span>
                        </li>
                        <li class="flex" style="background:#0c2927;line-height:2.225rem;margin-bottom:0.825rem;">
                            <span class="flex1"><span style="background:#EE6B6A;border-radius:5px;">低信用</span></span>
                            <span class="flex1">100%</span>
                            <span class="flex1">一个月一次</span>
                        </li>
                        <li class="flex" style="background:#0c2927;line-height:2.225rem;margin-bottom:0.825rem;">
                            <span class="flex1"><span style="background:#4FA791;border-radius:5px;">中信用</span></span>
                            <span class="flex1">30%</span>
                            <span class="flex1">一季度一次</span>
                        </li>
                        <li class="flex" style="background:#0c2927;line-height:2.225rem;margin-bottom:0.825rem;">
                            <span class="flex1"><span style="background:#3E92D4;border-radius:5px;">高信用</span></span>
                            <span class="flex1">10%</span>
                            <span class="flex1">一年一次</span>
                        </li>
                    </ul>
                </div>
                <div class="flex1 flex AlignItemsC">
                    <div class="rightImg">
                        <p class="textC" style="color:#EE718D;line-height:2rem;">失信惩戒</p>
                        <p class="flexC" style="margin:1.825rem 2.825rem;">
                            <span class="LH2R">提高检查频次</span>
                            <span class="LH2R">提高专项检查抽比例</span>
                            <span class="LH2R">必要时采取联合监管</span>
                        </p>
                    </div>
                </div>
                <div class="flex1" style="display:flex;align-items:flex-end;">
                    <div class="rightImg">
                        <p class="textC" style="color:#CBE971;line-height:2rem;">守信激励</p>
                        <p class="flexC" style="margin:1.825rem 2.825rem;">
                            <span class="LH2R">降低检查频次</span>
                            <span class="LH2R">减少专项抽查抽取比例</span>
                            <span class="LH2R">信用加分</span>
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
export default {
  name: 'CreditModal',
  data () {
    return {

    }
  }
}
</script>
<style scoped>
.creditModal-title {
    width: 100%;
    background: url(../../../assets/img/comprehensive/left/15.png) no-repeat center;
    background-size: 70% 100%;
    padding: 0.25rem 0;
}
.creditModal-left {
    background: url(../../../assets/img/comprehensive/left/16.png) no-repeat center;
    background-size: 100% 100%;
    width: 79%;
    height: 87%;
    margin-top: 2.25rem;
}
.left-contentbg {
    background: url(../../../assets/img/comprehensive/left/18.png) no-repeat center;
    background-size: 100% 100%;
    padding: 1rem 6.625rem;
    margin-top: 5.485rem;
}
.creditModal-middle {
    width: 82%;
    height: 87%;
    margin-top: 2.25rem;
}
.creditModal-middleLeft {
    /* background:url(../../../assets/img/comprehensive/left/20.png) no-repeat center; */
    /* background-size:100% 100%; */
    line-height:6.5825rem;
    width: 6.5825rem;
    height: 6.5825rem;
    /* color: #EE6B6A; */
    font-size: 26px;
    margin-right: 1rem;
}
.middleLeftImg01 {
    background:url(../../../assets/img/comprehensive/left/20.png) no-repeat center;
    background-size:100% 100%;
    color: #EE6B6A;
}
.middleLeftImg02 {
    background:url(../../../assets/img/comprehensive/left/21.png) no-repeat center;
    background-size:100% 100%;
    color: #4FA791;
}
.middleLeftImg03 {
    background:url(../../../assets/img/comprehensive/left/22.png) no-repeat center;
    background-size:100% 100%;
    color: #3E92D4;
}
.creditModal-middleRight {
    background:url(../../../assets/img/comprehensive/left/19.png) no-repeat center;
    background-size:100% 100%;
    line-height:5.825rem;
    height: 5.825rem;
    width: 19.875rem;
    margin-top: 0.585rem;
}
.creditModal-middleBottom {
    background:url(../../../assets/img/comprehensive/left/23.png) no-repeat center;
    background-size:100% 100%;
    width: 100%;
    height: 100%;
}
.creditModal-right {
    width: 82%;
    height: 87%;
    margin-top: 2.25rem;
}
.rightImg {
    background:url(../../../assets/img/comprehensive/left/24.png) no-repeat center;
    background-size:100% 100%;
    width: 100%;
    height: 90%;
}
</style>
